
import { Form, Input, Button } from "antd"
import { UserOutlined, LockOutlined, PhoneOutlined } from '@ant-design/icons';
import { useRef } from "react"
import { reg } from "../../utils/validate"
const { pwd, account, phone } = reg;

export default function ChangePwd() {

  const onFinish = () => {

  }
  const onFailed = () => {

  }
  const form = useRef()
  return (
    <div>
      <Form
        name="normal_login"
        className="login-form"
        initialValues={{    // 设置表单的初始值
        }}
        onFinish={onFinish}
        onFinishFailed={onFailed}
        ref={form}
        layout="vertical"
      >

        <Form.Item
          name="oldpass"
          label="旧密码"
          rules={[
            {
              required: true,
              message: '请输入旧密码',
            },
            {
              pattern: pwd,
              message: '请输入6-16位数字加字母的密码',
            },
          ]}
        >
          <Input.Password prefix={<LockOutlined className="site-form-item-icon" />} placeholder="请输入密码" />
        </Form.Item>

        <Form.Item
          name="newpass"
          label="新密码"
          rules={[
            {
              required: true,
              message: '请输入密码',
            },
            {
              pattern: pwd,
              message: '请输入6-16位数字加字母的密码',
            },
          ]}
        >
          <Input.Password prefix={<LockOutlined className="site-form-item-icon" />} placeholder="请输入密码" />
        </Form.Item>

        <Form.Item
          name="newdbpass"
          label="确认新密码"
          rules={[
            {
              required: true,
              message: '请输入密码',
            },
            {
              pattern: pwd,
              message: '请输入6-16位数字加字母的密码',
            },
          ]}
        >
          <Input.Password prefix={<LockOutlined className="site-form-item-icon" />} placeholder="请输入密码" />
        </Form.Item>


        <Form.Item>
          <Button block type="danger" htmlType="submit" >修改</Button>
        </Form.Item>

      </Form>
    </div>
  )
}